1
00:00:00,570 --> 00:00:03,370
Hell you are welcome in this lecture.

2
00:00:03,390 --> 00:00:13,170
We'll be creating the functionality for how our app using javascript.

3
00:00:13,440 --> 00:00:17,740
So I've got my javascript file here or on the blank files.

4
00:00:17,730 --> 00:00:21,800
Well this is where I'll will be adding the javascript.

5
00:00:21,790 --> 00:00:31,590
Could they way I'm going to structure this lecture is to rewrite the code add it and then explain it

6
00:00:32,040 --> 00:00:38,970
so that you don't have to waste time you watching me type and then explain it all right.

7
00:00:40,070 --> 00:00:40,540
All right.

8
00:00:40,560 --> 00:00:49,620
I've created two variables called variable number one variable number to this busy CLI it will generate

9
00:00:49,740 --> 00:00:59,220
the number when the game stuff so variable one variable to well randomly generate numbers when the game

10
00:00:59,220 --> 00:01:10,730
starts using the variables created in line 1 and 2 line 3 and 4 have added.

11
00:01:10,890 --> 00:01:18,140
For example I am using what you have defined a variable you can just use it by the name so I'm using

12
00:01:18,150 --> 00:01:24,470
variable 1 online 3 saying number 1 and I've set it with variables.

13
00:01:24,780 --> 00:01:26,010
I defined a variable.

14
00:01:26,040 --> 00:01:27,690
I didn't set the value.

15
00:01:27,960 --> 00:01:31,590
So when you creating a variable you can set the values at the same time.

16
00:01:31,620 --> 00:01:33,350
Or you can set it later.

17
00:01:33,600 --> 00:01:37,080
So in this case I am setting the value later.

18
00:01:37,160 --> 00:01:41,890
Which is in line 3 and 5 4 3.

19
00:01:41,940 --> 00:01:51,270
I'm using the variable number 1 and I've set it took equal to the function Mat's the top floor must

20
00:01:51,390 --> 00:01:59,490
flow from chambers's clearly is used to return the largest integer integers The number is used to return

21
00:01:59,490 --> 00:02:01,710
the largest integer.

22
00:02:01,860 --> 00:02:06,220
That is less than or equal to a given number.

23
00:02:06,240 --> 00:02:15,800
So for example if I have caught a number forty five point ninety five the masto floor will return a

24
00:02:15,810 --> 00:02:17,780
value of forty five.

25
00:02:18,000 --> 00:02:23,680
Okay so it is used to return the largest integer on number.

26
00:02:23,910 --> 00:02:27,540
That is less than or equal to a given number.

27
00:02:27,700 --> 00:02:34,300
Right and if you notice I have also set records from shows that have to take in the parameter.

28
00:02:34,320 --> 00:02:39,960
You can also pass in functions into other functions as barometers as well coming down here.

29
00:02:39,990 --> 00:02:46,410
I have now passed in a lot of functions called maths dot Randall.

30
00:02:46,500 --> 00:02:47,650
In fact that function.

31
00:02:48,000 --> 00:02:50,700
What mascott random Does must run done.

32
00:02:50,730 --> 00:03:00,840
Is used to a return random numbers between 0 which is inclusive and one which is exclusive right.

33
00:03:00,960 --> 00:03:01,480
So do it.

34
00:03:01,500 --> 00:03:06,450
That must that rundown will generate random number for our game.

35
00:03:06,840 --> 00:03:14,430
And here times I've used the operator earthier times 10 so it would generate 10 random numbers at that

36
00:03:14,430 --> 00:03:18,780
time and it would be incremental increase them by one each time.

37
00:03:18,960 --> 00:03:21,480
Same here line for here.

38
00:03:21,490 --> 00:03:29,460
I'm using the variable from line to same name setted to must top floor and past the admin must to a

39
00:03:29,460 --> 00:03:37,470
random function again multiplied a run of say the random number she should generate is 10 but this should

40
00:03:37,470 --> 00:03:39,350
increase as it is time by 1.

41
00:03:39,420 --> 00:03:46,380
That's what I have done here line 3 and 4 and 5 here I am using the documentor get element back a day

42
00:03:46,710 --> 00:03:49,860
and pass the variable number one.

43
00:03:50,190 --> 00:03:59,230
So we send and get eliminated by the variable number one and dot in the CML was number one.

44
00:03:59,260 --> 00:04:02,030
So this dot in a to a replaced.

45
00:04:02,070 --> 00:04:06,060
In any email wait no one with this variable.

46
00:04:06,070 --> 00:04:08,100
There's no one here.

47
00:04:08,100 --> 00:04:15,840
If we go back to our t mail file does this is this.

48
00:04:15,840 --> 00:04:19,370
No what is referring to is referring to d div.

49
00:04:19,500 --> 00:04:21,830
Okay and then the db number two.

50
00:04:21,840 --> 00:04:23,910
So that's what we mean here.

51
00:04:23,920 --> 00:04:25,520
My number one number two.

52
00:04:25,710 --> 00:04:32,100
So who's gonna grab that to what this code is saying is that good today hastier mail DB take all that

53
00:04:32,100 --> 00:04:35,020
that is here mail Deve and inject.

54
00:04:35,160 --> 00:04:38,660
This value is variable here which is just number one which is different.

55
00:04:38,660 --> 00:04:45,000
It is variable so is gone on tick of an additive and inject the variable the random number generator.

56
00:04:45,000 --> 00:04:48,120
Here is going to inject that in that Dave.

57
00:04:48,240 --> 00:04:50,650
Okay similar thing on number 6.

58
00:04:50,650 --> 00:04:58,980
It will go to the hastier mail to Cleveland Dave and inject this variable generated automatically from

59
00:04:58,980 --> 00:04:59,690
line form.

60
00:04:59,970 --> 00:05:01,470
That's what that means.

61
00:05:01,540 --> 00:05:06,860
It means replace was step before with the value specify.

62
00:05:07,650 --> 00:05:11,710
I've created another variable online line called variable answer.

63
00:05:11,880 --> 00:05:20,220
This variable will provide the answers for the additions write some variable of coded answer and the

64
00:05:20,220 --> 00:05:27,420
values number one plus number two so if you add the random number generator eg from 1 for a variable

65
00:05:27,420 --> 00:05:31,880
number one agreeable number two and he to provide the answer.

66
00:05:33,390 --> 00:05:41,640
I have added some more code here like 11 to 13 created a variable called check answer in line 11 so

67
00:05:41,630 --> 00:05:48,180
it is variable we allow you to check for your answer was You have imported it in and have sent it to

68
00:05:48,210 --> 00:05:50,120
you course to documents.

69
00:05:50,220 --> 00:06:00,690
Query select query select or method basically is used to return the first element that matches is specified

70
00:06:00,730 --> 00:06:05,820
x SS select all or select tors in the document.

71
00:06:05,850 --> 00:06:15,840
So in this case it's referring to the inputs alright and by line 12 here a variable called value and

72
00:06:15,840 --> 00:06:18,870
the answer is set it too close to check.

73
00:06:18,870 --> 00:06:20,360
Answer done value.

74
00:06:20,550 --> 00:06:30,770
So what these variable do it will take the value of the check answer variable and add it to whatever

75
00:06:30,780 --> 00:06:37,290
value has been put into a well of only user types into the input for the addition it will add value

76
00:06:37,650 --> 00:06:41,450
to the total value variable and displayed variable.

77
00:06:41,490 --> 00:06:50,520
13 is like 13 is the button and attached to the button set it to a document but query select time is

78
00:06:50,520 --> 00:06:58,290
in the query select a gain insight that the input and type is a button and the value is.

79
00:06:58,290 --> 00:07:00,560
Check check.

80
00:07:00,690 --> 00:07:04,550
The value is check is what will be displayed inside the button.

81
00:07:04,590 --> 00:07:08,750
That is the text they'll be displayed.

82
00:07:08,820 --> 00:07:16,040
I have had a good function here on line 14.

83
00:07:16,080 --> 00:07:25,710
I have used the Boston variable that was created on line 13 so I've used a bottom variable there and

84
00:07:25,720 --> 00:07:35,640
I'm at tast the On Click event to it and I've set it to a function so it clicked click basically event

85
00:07:35,640 --> 00:07:38,620
is that when you click a button it triggers a function.

86
00:07:38,620 --> 00:07:39,750
So this is a function.

87
00:07:39,750 --> 00:07:41,500
I'm defining here.

88
00:07:41,910 --> 00:07:48,010
Okay so the content between this function can you see the opening curly braces and the end here.

89
00:07:48,030 --> 00:07:52,120
This is what happens when the button is clicked.

90
00:07:52,140 --> 00:07:54,830
So basically what's in the value.

91
00:07:55,200 --> 00:07:55,650
Okay.

92
00:07:55,650 --> 00:08:00,000
Notice you got a variable there called value as well on line 12.

93
00:08:00,180 --> 00:08:08,380
So what I'm saying here on line 15 is that the variable value equal to check answer dot value of the

94
00:08:08,400 --> 00:08:16,240
variables will quote check answer that add value and dont introduce an if state if statement.

95
00:08:16,250 --> 00:08:21,290
I used to determine conditions under which a code will execute.

96
00:08:21,310 --> 00:08:29,450
So line 16 here is saying that if the value is strictly equal to a double double is equal.

97
00:08:29,840 --> 00:08:39,840
If the value is equal to answer yes then you should see alert you to pop up an alert box and say you

98
00:08:39,840 --> 00:08:41,730
are correct.

99
00:08:41,970 --> 00:08:45,750
If the value is not equal to the answer.

100
00:08:45,960 --> 00:08:55,820
For example if you type in one bloss one and he says two the alert will come up and say you are correct.

101
00:08:56,010 --> 00:09:04,420
If the answer is wrong else there means that the answer is wrong then do.

102
00:09:05,110 --> 00:09:07,830
Display the second message which is alert.

103
00:09:08,020 --> 00:09:09,610
You are incorrect.

104
00:09:09,640 --> 00:09:12,060
The answer was plus.

105
00:09:12,100 --> 00:09:18,080
And then it will add the answer remember we created the variables can answer it all now.

106
00:09:18,110 --> 00:09:23,110
And the correct answer after displaying the message you are incorrect.

107
00:09:23,140 --> 00:09:26,020
So if stood bent I used to execute.

108
00:09:26,020 --> 00:09:28,380
Could based on the conditions.

109
00:09:28,390 --> 00:09:30,130
So the first condition is correct.

110
00:09:30,160 --> 00:09:32,140
You get the first alert.

111
00:09:32,140 --> 00:09:41,800
It does not correct you get the second look at as part of the function from line twenty two to twenty

112
00:09:41,800 --> 00:09:42,100
eight.

113
00:09:42,100 --> 00:09:50,770
We've got documents dot query select on methods whereby when the button is clicked is you have to impled

114
00:09:50,860 --> 00:09:58,300
the tax and if whatever you put the value will be added then line 23 got documental.

115
00:09:58,300 --> 00:10:08,710
Get elemen back Heidi to e all p carb the eidy from the div which is number one and then it will insert

116
00:10:08,920 --> 00:10:10,370
to replace that using the.

117
00:10:10,370 --> 00:10:11,240
Now don't hit him.

118
00:10:11,230 --> 00:10:14,490
I'll replace that with the value that's been tightening.

119
00:10:14,500 --> 00:10:16,430
You notice the code says blank.

120
00:10:16,460 --> 00:10:23,920
So who has represented the value that will be typed in their line 24 document the LMM by this same thing

121
00:10:23,920 --> 00:10:25,290
with no Deve.

122
00:10:25,360 --> 00:10:27,170
Number two he tool.

123
00:10:27,190 --> 00:10:36,180
Replace that and insert the code of value tag team twenty five line twenty five news in the variable

124
00:10:36,190 --> 00:10:37,970
number 1 again.

125
00:10:37,990 --> 00:10:40,440
Of course I am using that same function again.

126
00:10:40,450 --> 00:10:46,710
These are the functions the variables now were defined earlier so I'm using that variable with a MUST

127
00:10:46,710 --> 00:10:50,030
top floor past in the mizar Round on.

128
00:10:50,320 --> 00:10:57,730
It would generate 10 random numbers and increase by 1 each time 20 seats line 26 same theme.

129
00:10:57,850 --> 00:11:03,350
It will generate 10 random numbers and increase my one a time line.

130
00:11:03,360 --> 00:11:05,350
27 is a document.

131
00:11:05,380 --> 00:11:14,650
Get LMA it data to gently to pick the div number one DBD number two and replace it with the value of

132
00:11:15,280 --> 00:11:18,890
the variable number one and a variable number two.

133
00:11:19,150 --> 00:11:21,360
I am 30 is the answer.

134
00:11:21,610 --> 00:11:26,870
So again I'm calling the variable there Ansal which is equal so number one.

135
00:11:26,920 --> 00:11:27,520
Number two.

136
00:11:27,520 --> 00:11:33,490
So basically what I've done is that within this function I have included more so the variables that

137
00:11:33,490 --> 00:11:37,600
were defined earlier on the variables are defined early.

138
00:11:37,720 --> 00:11:45,730
Also just incorporate them into the function so this function will be fired off when the button is clicked.

139
00:11:46,000 --> 00:11:52,140
So let me say that and then we can test.

140
00:11:52,620 --> 00:11:57,990
Our less test day app to make sure everything is working so one plus 7 are typing it.

141
00:11:58,120 --> 00:12:03,740
Now click on check answer it told me are correct so this is where the function what sort of form Chad

142
00:12:03,740 --> 00:12:10,080
has been wrapped around inside this checkbox here or right the button so he generate another number.

143
00:12:10,100 --> 00:12:14,610
Type in 14 and told me you are correct.

144
00:12:14,610 --> 00:12:19,880
So our or maths game is working correctly.

145
00:12:20,140 --> 00:12:21,520
Thank you so much for watching.

146
00:12:21,520 --> 00:12:24,760
Are there any parts of these projects you do not understand.

147
00:12:24,760 --> 00:12:26,430
Please do let me know.

148
00:12:26,470 --> 00:12:28,870
Be more than happy to help.

149
00:12:28,870 --> 00:12:35,870
I have not included the code for this purpose because some want you to try and work things out.

150
00:12:35,980 --> 00:12:39,100
But if you do have any issues please to let me know.

151
00:12:39,100 --> 00:12:40,070
Thanks for watching.

152
00:12:40,120 --> 00:12:41,110
All the best.

153
00:12:41,110 --> 00:12:42,030
Bye for now.